 <%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="<%=basePath%>static/css/common_css.css" rel="stylesheet" />
<title>车票预订 | 票务系统</title>
<link rel="stylesheet" href="<%=basePath%>static/css/jquery-ui.min.css" />
<script type="text/javascript"
	src="<%=basePath%>static/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript"
	src="<%=basePath%>static/js/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function(){
	$( "#dialog" ).dialog({ autoOpen: false });
	$("#startTime").datepicker({
  		maxDate: 15, 
  		minDate:0,
		dateFormat: 'yy-mm-dd'
	});
});

function searchTicket() {
	if($("#startStation").val()=="") {
		alert("请输入起始地");
		return false;
	}
	if($("#endStation").val()=="") {
		alert("请输入目的地");
		return false;
	}
	if($("#startTime").val()=="") {
		alert("请输入出发日");
		return false;
	}
	$("#searchForm").submit();
}

function yuding(id) {
	var user = $.trim($("#user").val());
	if(user=="") {
		alert("请先登录才可预订");
		$("#ticketOrderId").val(id);
		$( "#dialog" ).dialog( "open" );
	} else{
		window.location.href="<%=basePath%>order/yuding?ticketOrderId="+id;
	}
}

function login() {
	var userId=$("#userId").val();
	var password = $("#password").val();
	var ticketOrderId = $("#ticketOrderId").val();
	$.ajax({
		url:"<%=basePath%>login/loginIn",
		data:{userId:userId,password:password},
		type:"post",
		success:function(data) {
			if(data) {
				$( "#dialog" ).dialog( "close" );
				checkOrder(ticketOrderId);
			} else {
				alert("用户名密码不正确");
			}
		},
		error:function() {
			alert("系统出错");
			$( "#dialog" ).dialog( "close" );
		}
	});
	//若有订单未付款，则不能进行预订车票
	function checkOrder(ticketOrderId){
		$.ajax({
			url:"<%=basePath%>order/checkOrder",
			type:"post",
			success:function(data){
				if(data){
					alert("您有未付款订单，请付款后在进行车票预订！");
					searchTicket();
				}else{
					window.location.href="<%=basePath%>order/yuding?ticketOrderId="+ticketOrderId;
				}
			}
		})
	}
	
}
</script>
</head>
<body>
<!--header start-->
<div class="header"><div style="z-index: 2000" class="header-bd">
<a href="<%=basePath %>login/index"><h1 class="logo">票务中心</h1>
</a>
<div class="login-info"><div class="phone-link">
</div>
<div class="menu">
</div>
<span class="login-txt" style="color: #666666"><span>意见反馈:12345@163.com </span>
<input id="user" value="${sessionScope.user } " type="hidden">
<c:if test="${sessionScope.user!=null }">
<span style="width:50px;">${sessionScope.user.userName }</span>
| <a id="regist_out" href="<%=basePath %>login/loginOut">退出</a>
</c:if>
<c:if test="${sessionScope.user==null }">
请
<a id="login_user" href="<%=basePath %>login/toLogin" class="colorA" style="margin-left:-0.5px;">登录</a>
|<a id="regist_out" href="<%=basePath %>login/toRegister">注册</a>
</c:if> 
</span>
</div>
<div class="nav"><ul><li><a href="<%=basePath %>login/index">客运首页</a>
</li>
<li id="selectYuding"><a href="<%=basePath %>order/searchTickets" >车票预订</a>
</li>

<li><a href="<%=basePath %>ticket/searchTicketsByCon" target="_blank">车次查询</a>
</li>
<li><a href="<%=basePath %>ticket/searchTicketsByCon" target="_blank">票价查询</a>
</li>
<li><a href="<%=basePath %>ticket/searchTicketsByCon" target="_blank">站点查询</a>
</li>
<c:if test="${sessionScope.user!=null }">
<li ><a href="<%=basePath %>login/main">个人中心</a>
</li>
</c:if>
</ul>
</div>
</div>
</div>
	<!--header end-->
	<!--页面主体  开始-->
	<div class="content" style="min-height: 424px;">
<!--车票搜索框 开始-->
<div class="sear-box quick-sear-box">
<form id="searchForm" method="post" action="<%=basePath %>order/searchTickets" >
<div class="s-info" id="place_area" style="margin: 0 100px 0 100px">
<ul><li><span class="label"><label id="fromStationText_label">出发地</label>
</span>
<div class="inp-w">
<input id="startStation" class="inp-txt inp_selected"  value="${orderSearch.startStation }" name="startStation" type="text">
</div>
</li>
<li><span class="label"><label id="toStationText_label"> 目的地</label>
</span>
<div class="inp-w">
<input id="endStation" class="inp-txt inp_selected"  name="endStation" value="${orderSearch.endStation }" type="text">
</div>
</li>
<li><span class="label"> 出发日</span>
<div class="inp-w">
<input class="inp_selected" name="startTime" id="startTime" value='<fmt:formatDate value="${orderSearch.startTime }" pattern="yyyy-MM-dd"/>'  readonly="readonly" type="text">
</div>
</li>
</ul>
</div>
<div class="quick-s">
<div class="btn-area" style="margin-top:15px" >
	<a href="javascript:void(0);" id="query_ticket" onclick="searchTicket();" class="btn92s" shape="rect">查询</a>
</div>
</div>
</form>
</div>
<!--车票搜索框 结束-->
<div class="sear-result" id="sear-result" style="display:block;">
<c:if test="${orderSearch!=null }">
<p><strong>${orderSearch.startStation } --&gt; ${orderSearch.endStation }（<fmt:formatDate value="${orderSearch.startTime }" pattern="yyyy年MM月dd日"/>）</strong>
共计<strong id="trainum">${list.size()}</strong>个车次</p>
</c:if>
</div>
<div class="t-list" id="t-list">
<table><thead>
<tr class="th" id="float">
<th colspan="1" rowspan="1" width="17%">车次</th>
<th colspan="1" rowspan="1" width="17%">出发站</th>
<th colspan="1" rowspan="1" width="17%">到达站</th>
<th colspan="1" rowspan="1"  width="17%">出发时间</th>
<th colspan="1" rowspan="1"  width="17%">剩余车票</th>
<th class="last" colspan="1" rowspan="1">备注</th>
</tr>
</thead>
<tbody id="queryLeftTable">
<c:forEach items="${list }" var="ticketOrder" varStatus="index">
	<tr <c:if test="${index.count%2==0 }"> class="bgc"</c:if>>
		<td colspan="1" >${ticketOrder.ticket.ticketNo }</td> 
		<td  align="center">${ticketOrder.ticket.startStation }</td> 
		<td style="cursor: pointer;" align="center">${ticketOrder.ticket.endStation }</td> 
		<td style="cursor: pointer;" align="center"><fmt:formatDate value="${ticketOrder.startTime }" pattern="yyyy-MM-dd HH:mm:ss"/> </td> 
		<td style="cursor: pointer;" align="center">${ticketOrder.ticketNumber }</td> 
		<td class="no-br"  align="center">
			<c:choose>
				<c:when test="${ticketOrder.ticketNumber==0 }">
					预订
				</c:when>
				<c:otherwise>
					<a href="javascript:void(0);" class="btn72" onclick="yuding('${ticketOrder.id}');">预订</a>
				</c:otherwise>
			</c:choose>
		</td>
	</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
	<!--页面主体  结束-->
	<!--页面底部  开始-->
	<div class="footer">
		<p>
			<a href="javascript:void(0);" >关于我们</a>
			|<a href="javascript:void(0);" >网站声明</a>
		</p>
		<p>版权所有 © 2008-2017 中国铁路信息技术中心 中国铁道科学研究院</p>
		<p>京ICP备15003716号-3&nbsp;&nbsp;|&nbsp;&nbsp;京ICP证150437号</p>
	</div>
	<!--页面底部  结束-->
<!-- 登录模态框 -->	
<div id="dialog" title="登录">
		<input id="ticketOrderId" type="hidden">
	  <p><label>用户名:</label><input type="text"  id="userId" name="userId"></p>
	  <p><label>密    码:</label><input type="password" id="password" name="password"></p>
	  <p><a href="javascript:void(0);" id="query_ticket" onclick="login();" class="btn92s" shape="rect">登录</a></p>
</div>
	</body>
	</html>